import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:yt_devops/components/app_bar/app_bar_widget.dart';
import 'package:yt_devops/components/yt_text_style.dart';
import 'package:yt_devops/resources/str_res_keys.dart';
import 'package:yt_devops/styles/styles.dart';

import '../../../devices/device_tab/device_detail/new_air_cooling_page/component/current_voltage_chart.dart';
import 'language_page_controller.dart';

class LanguagePage extends GetView<LanguagePageController> {
  LanguagePage({Key? key}) : super(key: key);
  @override
  final controller = Get.put(LanguagePageController());

  @override
  Widget build(BuildContext context) {
    if (Get.locale != null && Get.locale!.languageCode.toString() == 'en') {
      controller.checkIndex = 1;
    }
    return Scaffold(
        backgroundColor: Colour.backgroundColor,
        appBar: AppBarWidget.defaultAppBar(ResKey.multilingual.tr),
        body: GetBuilder<LanguagePageController>(
            builder: (controller) => Container(
              height: 104,
                alignment: Alignment.center,
                clipBehavior: Clip.hardEdge,
                margin: const EdgeInsets.only(left: 16, right: 16,top: 10),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(8),
                  color: Colors.white,
                ),
                child: ListView.builder(
                  padding: EdgeInsets.zero,
                  physics: const NeverScrollableScrollPhysics(),
                  itemBuilder: (context, index) {
                    return _itemWidget(index);
                  },
                  itemCount: controller.languageList.length,
                ))));
  }

  _itemWidget(int index ){
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () => controller.changeLanguage(index),
      child: Container(
        height: 52,
        color: Colors.white,
        child: Column(
          children: [
            Row(
              children: [
                 Container(
                   padding: EdgeInsets.only(left: 16),
                   alignment: Alignment.centerLeft,
                  height: 51,
                  child: Text(controller.languageList[index],style:ytTextStyle(
                      fontSize: 16,
                      color: controller.checkIndex == index
                          ? Colour.primaryColor
                          : Colour.mainTextColor),),
                ),
                const Spacer(),
                Visibility(
                    visible: controller.checkIndex == index,
                    child: Container(
                      margin: EdgeInsets.only(right: 24.w),
                      child: Image.asset(
                        'assets/images/icon_selected_tick.png',
                        width: 20.w,
                        height: 20.w,
                        // color: Colour.mainTextColor,
                      ),
                    ))
              ],
            ),
            Visibility(
              visible: index != controller.languageList.length -1,
                child: Container(
              margin: EdgeInsets.only(left: 16,right: 16),
              height: 1,
              color: Colour.dividerColor,
            ))
          ],
        ),
      ),
    );
  }
}
